<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../lib/vue.min.js"></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="../lib/elementui-index.js"></script>
    <script src="../lib/axios.min.js"></script>
    <script src="../lib/token.js"></script>

    <style>
        .el-header {
            background-color: #B3C0D1;
            color: #333;
            line-height: 60px;
        }

        .el-aside {
            color: #333;
        }
    </style>

</head>
<body>

<div id="app">
    <el-container>
        <el-main>
            <!-- 表格 -->
        <el-table :data="tableData">
            <el-table-column prop="pid" label="产品编号" width="180">
            </el-table-column>
            <el-table-column prop="ptype" label="产品类型" width="180">
            </el-table-column>
            <el-table-column prop="prequire" label="材质要求" width="180">
            </el-table-column>
            <el-table-column prop="psize" label="产品尺寸" width="120">
            </el-table-column>
            <el-table-column prop="ooid" label="合同编号">
            </el-table-column>
            <el-table-column prop="pstate" label="当前状态">
                <template slot-scope="scope">
                    {{ scope.row.pstate | capitalize }}
                </template>
            </el-table-column>
            <el-table-column  label="审核操作">
            <template slot-scope="scope">
                <el-button type="text" @click="selectOne(scope.row.pid,scope.row.pstate)">详情</el-button>
                <el-button type="text" @click="rebutOneProduct(scope.row.pid,scope.row.pstate)">驳回</el-button>
                <el-button type="text" @click="assertOneBuystate(scope.row.pid,scope.row.pstate)">通过</el-button>
            </template>
            </el-table-column>
            <!-- <el-table-column label="订单详情">
                <template slot-scope="scope">
                    <el-button @click="getProduct(scope.row)" type="text">查看</el-button>
                </template>
            </el-table-column> -->

        </el-table>
        <!-- ------------------------------点击详情出现一个弹窗---------------------------------------- -->
           <!-- 弹窗去充值页面，充值水费，电费和物业费 -->
           <el-dialog title="申请详情" :visible.sync="dialogFormVisible">
            <el-form :model="form">
                <el-form-item label="产品编号:">
                    <el-input v-model="form.pid"></el-input>
                </el-form-item>
                <el-form-item label="申请班别:">
                    <el-input v-model="form.tname"></el-input>
                </el-form-item>
                <el-form-item label="申请时间:">
                    <el-input v-model="form.ptime"></el-input>
                </el-form-item>

    
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">返 回</el-button>
                <!-- <el-button type="primary" @click="insertOneBuy()">确 定</el-button> -->
            </div>
            </el-dialog>
            <!-- ---------------------------弹窗到现在结束------------------------------------------------- -->
        <!-- 分页 -->
        <div class="block">
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="pageNum"
              :page-sizes="[5, 10, 15, 20]"
              :page-size="pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="total">
            </el-pagination>
        </div>
        </el-main>
    </el-container>
</div>


<script>
    new Vue({
        el: '#app',
        data() {
            return {
                tableData:'',
                pageNum:'',
                pageSize:'',
                total:'',
                dialogTableVisible: false,
                dialogFormVisible:false,
                ooid:'',
                form:{
                pid:'',
                ptime:'',
                tname:''
                }
          
            }
        },
        created(){
            this.getAll();
        },

        methods:{
            rebutOneProduct(pid,pstate){
                console.log(pid)
                console.log(pstate)
                axios.get("http://localhost:8001/production1/quality/rebut",{
                    params:{
                        pid:pid,
                        pstate:pstate
                    }
                }).then(Response=>{
                    if(Response.data){
                        this.$message.success("驳回成功")
                        this.getAll();
                    }else{
                        this.$message.error("驳回失败");
                        this.getAll();
                    }
                })

            },
            assertOneBuystate(pid,pstate){
                console.log(pid)
                console.log(pstate)
                axios.post(`http://localhost:8001/production1/quality/approve/${pid}/${pstate}`
                  
                ).then(Response=>{
                    if(Response.data){
                        this.$message.success("审核通过")
                        this.getAll();
                    }else{
                        this.$message.error("审核失败")
                        this.getAll();
                    }
                })
            },
            fx(){
        this.dialogFormVisible=true;
            },
            selectOne(pid,pstate){
                var pid=pid;
                var pstate=pstate;
                console.log(pid)
                console.log(pstate)
                   axios.get("http://localhost:8001/production1/quality/findOne",{
                       params:{
                           pid:pid,
                           pstate:pstate
                       }}).then(Response=>{
                           console.log(Response.data)
                           
                           var data=Response.data;
                           this.form.pid=data.pid;
                           this.form.pstate=data.pstate;
                           if(data.tid==null){
                              this.form.tname='暂未填写';
                           }else if(data.tid==1){
                              this.form.tname='砂型A组';
                           }else if(data.tid==2){
                              this.form.tname='砂型B组';
                           }else if(data.tid==3){
                              this.form.tname='浇铸A组';
                           }else if(data.tid==4){
                              this.form.tname='浇铸B组';
                           }else if(data.tid==5){
                              this.form.tname='加工A组';
                           }else if(data.tid==6){
                              this.form.tname='加工B组';
                           }
                           this.form.ptime=data.time;
                          console.log(this.form.ptime)
                         this.fx();
                       })
                   
            },
            getAll(){
                this.ooid = sessionStorage.ooid
                console.log(sessionStorage.ooid)
                axios.get(`http://localhost:8001/production/product/findProductByState`,{
                    params:{
                        pageNum:this.pageNum,
                        pageSize:this.pageSize,
                        pstate:5
                    }
                })
                .then(res=>{
                    console.log(res)
                    this.tableData = res.data.list
                    this.pageNum = res.data.pageNum
                    this.pageSize = res.data.pageSize
                    this.total = res.data.total
                    
                })
            },
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
                this.pageSize = val
                this.getAll()
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
                this.pageNum = val
                this.getAll()
            },
            changeSwitch(row){
                axios.delete(`http://localhost:8080/order/delOrder/${row.oid}/${row.ooo}`)
                .then(res=>{
                    console.log(res)
                    if(res.data === true){
                        this.$message({
                            message:'修改成功',
                            type:"success"
                        })
                    }else{
                        this.$message({
                            message:'修改失败',
                            type:"error"
                        })
                    }
                    this.getAll()
                })
            }
        },
        created(){
            this.getAll()
        },
        filters:{
            capitalize: function (value){
                if(value==="1"){
                    return "打型申请"
                }
                else if(value === "3"){
                    return "粘型申请"
                }else if(value === "5"){
                    return "浇铸申请"
                }else if(value === "7"){
                    return "出箱申请"
                }else if(value === "9"){
                    return "加工申请"
                }else if(value === "11"){
                    return "组装申请"
                }
            }
        },
    })
</script>


</body>
</html>